setTimeout(function () {
    document.querySelector('.container').style.overflow = 'auto';
    document.querySelector('.text').style.display = 'none';
    document.querySelector('.content').style.display = 'block';
}, 6500);
var ul = document.getElementById('grid');
var scroll = document.querySelector('.scroll');
var nowClick;
var body = document.body;

var el = document.querySelector('.showArticle');
body.className += ' grid3d';
function add() {
    this.children[0].innerHTML = Number(this.children[0].innerHTML) + 1;
}
var reads = document.querySelector('.reads');
function up(e) {
    add.call(document.querySelector('.ups'));
    //ajax
    var id = nowClick.getAttribute('data-id');
    $.ajax({
        type: "GET",
        url: "/account/ups/" + id,
        contentType: "application/x-www-form-urlencoded;charset=UTF-8"
    });
}
function down(e) {
    add.call(document.querySelector('.downs'));
    //ajax
    var id = nowClick.getAttribute('data-id');
    $.ajax({
        type: "GET",
        url: "/account/downs/" + id,
        contentType: "application/x-www-form-urlencoded;charset=UTF-8"
    });
}
//function HTMLDecode(text) {
//    var temp = document.createElement("div");
//    temp.innerHTML = text;
//    var output = temp.innerText || temp.textContent;
//    temp = null;
//    return output;
//}
function myClick(e) {
    if (!nowClick) {
        nowClick = e
    } else {
        return;
    }
    //ajax 获取标题文章阅读数量 ups downs
    var id = parseInt(e.getAttribute('data-id'));
    //ajax
    $.ajax({
        type: "GET",
        url: "/account/read/" + id,
        //data: msg,
        contentType: "application/x-www-form-urlencoded;charset=UTF-8",
        success: function (data) {
            //alert("Data Loaded: " + data);
            if (data.length > 5) {
                document.querySelector('.ajax-show').innerHTML = data;
                var c = $(data)[1];
                var text = c.innerText || c.textContent;
                document.querySelector('.ajax-show-content').innerHTML = text;
            } else {
                e.parentNode.removeChild(e);
                document.querySelector('.ajax-show').innerHTML = data;
                new GridScrollFx(document.getElementById('grid'), {
                    viewportFactor: 0.4
                });
            }
            Prism.highlightAll();
        }
    });
    //e.querySelector('.curtain') && e.querySelector('a').removeChild(e.querySelector('.curtain'));
    var left = (scroll.clientWidth - ul.offsetWidth) / 2 + 7;
    var top = document.querySelector('.container').offsetHeight - ul.offsetHeight;
    e.className = e.className + ' read';
    setTimeout(function () {
        body.className = body.className.replace(/ grid3d/g, ' article3d');
        var aChild = e.querySelector('a');
        setTimeout(function () {
            var showTop = scroll.scrollTop === 0 ? top + e.offsetTop : (scroll.scrollTop >= top ? e.offsetTop + top - scroll.scrollTop : top - scroll.scrollTop + e.offsetTop);
            el.style = 'top:' + (showTop - 23) + 'px;left:' + (e.offsetLeft + left) + 'px;height:' + aChild.clientHeight + 'px;width:' + aChild.clientWidth + 'px';
            el.className += ' showBox ieShow';
            setTimeout(function () {
                document.querySelector('.ajax').style.display = 'block';
                document.querySelector('.ajax-show').style.display = 'block';
                document.querySelector('.ajax-lodingimg').style.display = 'none';
            }, 1300);
            setTimeout(function () {
                document.querySelector('.ajax-lodingimg').style.display = 'block';
            }, 800)
        }, 100)
    }, 400)
}
function close() {
    var Article = document.querySelector('.showArticle');
    Article.className = Article.className.replace(/ showBox ieShow/g, '');
    body.className = body.className.replace(/ article3d/g, ' grid3d');
    nowClick.className = nowClick.className.replace(/ read/g, '');
    document.querySelector('.ajax').style.display = 'none';
    document.querySelector('.ajax-show').style.display = 'none';
    document.querySelector('.ajax-edit') ? document.querySelector('.ajax-edit').style.display = 'none' : '';
    nowClick = false;
}
document.querySelector('.close').addEventListener('click', close, false);
var changes = document.querySelectorAll('.change');
if (changes) {
    function shift() {
        var e = nowClick;
        //e.querySelector('.curtain') && e.querySelector('a').removeChild(e.querySelector('.curtain'));
        var left = (scroll.clientWidth - ul.offsetWidth) / 2 + 7;
        var top = document.querySelector('.container').offsetHeight - ul.offsetHeight;
        e.className = e.className + ' read';
        setTimeout(function () {
            var aChild = e.querySelector('a');
            body.className = body.className.replace(/ grid3d/g, ' article3d');
            setTimeout(function () {
                var showTop = scroll.scrollTop === 0 ? top + e.offsetTop : (scroll.scrollTop >= top ? e.offsetTop + top - scroll.scrollTop : top - scroll.scrollTop + e.offsetTop);
                el.style = 'top:' + (showTop - 23) + 'px;left:' + (e.offsetLeft + left) + 'px;height:' + aChild.clientHeight + 'px;width:' + aChild.clientWidth + 'px';
                el.className += ' showBox ieShow';
                setTimeout(function () {
                    document.querySelector('.ajax').style.display = 'block';
                    document.querySelector('.ajax-edit').style.display = 'block';
                    document.querySelector('.ajax-lodingimg').style.display = 'none';
                }, 1500);
                setTimeout(function () {
                    document.querySelector('.ajax-lodingimg').style.display = 'block';
                }, 800)
            }, 100)
        }, 400);
    }
    function now(e){
        if (!nowClick) {
            if(e.querySelector('i')){
                nowClick=e;
                return;
            }
            nowClick = e.parentNode;
            return;
        } else {
            return;
        }
    }
    if (document.querySelector('.write'))document.querySelector('.write').parentNode.parentNode.parentNode.onclick = function () {
        document.querySelector(".edittitle").value = '';
        now(this);
        shift.call(this);
        document.querySelector('.fr-view').innerHTML = '';
    };
    function eventEdit(changes){
        for (var i = 0; i < changes.length; i++) {
            changes[i].addEventListener('click', function (event) {
                event.preventDefault(); // 阻止默认事件
                event.stopPropagation(); // 阻止冒泡
                now(this);
                //ajax
                var id = parseInt(this.parentNode.getAttribute('data-id'));
                $.ajax({
                    type: "GET",
                    url: "/admin/edit/" + id,
                    contentType: "application/x-www-form-urlencoded;charset=UTF-8",
                    success: function (data) {
                        data = JSON.parse(data);
                        document.querySelector(".edittitle").value = data.title;
                        document.querySelector('.fr-view').innerHTML = data.content;
                    }
                });
                shift.call(this);
            }, false)
        }
    }
    eventEdit(changes);
    function eventDelete(deletes){
        for (var i1 = 0; i1 < deletes.length; i1++) {
            deletes[i1].addEventListener('click', function (event) {
                event.preventDefault(); // 阻止默认事件
                event.stopPropagation(); // 阻止冒泡
                var id = parseInt(this.parentNode.getAttribute('data-id'));
                ul.removeChild(this.parentNode);
                //ajax
                //var msg= {id:id} ;
                $.ajax({
                    type: "GET",
                    url: "/admin/del/" + id,
                    //data: msg,
                    contentType: "application/x-www-form-urlencoded;charset=UTF-8",
                    success: function (data) {
                        alert("Data Loaded: " + data);
                        new GridScrollFx(document.getElementById('grid'), {
                            viewportFactor: 0.4
                        });
                    }
                });
            }, false)
        }
    }
    eventDelete(document.querySelectorAll('.delete'));
    if (document.querySelector('#save'))document.querySelector('#save').onclick = function () {
        //ajax
        var title = document.querySelector(".edittitle").value;
        var content = $('div#froala-editor').froalaEditor('html.get');
        if (nowClick.querySelector('.write')) {
            var msg = {title: title, content: content};
            var type = 'add';
        } else {
            var id = nowClick.getAttribute('data-id');
            var msg = {title: title, content: content, id: id};
            var type = 'edit/' + Math.random() * 10;
        }
        if (type === 'add') {
            var last = ul.lastElementChild;
            var newLi = last.cloneNode(true);
			if(!newLi.querySelector('.indexTitle')){
				newLi =document.querySelector('#newLi');
				};
            var imgId=(Number.parseInt(/\d+\)/.exec(newLi.querySelector('img').src))+1);
            if(imgId>25)imgId=0;
            newLi.querySelector('.indexTitle').innerHTML = title;
            newLi.querySelector('img').src ="/img/("+ imgId+").jpg";
            ul.appendChild(newLi);
            new GridScrollFx(document.getElementById('grid'), {
                viewportFactor: 0.4
            });
            new GridScrollFx(document.getElementById('grid'), {
                viewportFactor: 0.4
            });
            eventEdit(document.querySelectorAll('.change'));
            eventDelete(document.querySelectorAll('.delete'));
        } else {
            nowClick.querySelector('.indexTitle').innerHTML = title;
        }

        $.ajax({
            type: "POST",
            url: "/admin/" + type,
            data: msg,
            //data: {msg:msg},
            contentType: "application/x-www-form-urlencoded;charset=UTF-8",
            success: function (data) {
                if (type === 'add') {
                    data = JSON.parse(data);
					console.log(data)
                    newLi.setAttribute('data-id', data.id);
                    alert("Data Loaded: " + data.msg||data);
                    return;
                }
                alert("Data Loaded: " + data);
            }
        });
        close();
    }
}
